import React from 'react';
import { Button, Form, Input,message } from 'antd';

import { loginAdmin } from '@/api/admin';
import { useAppDispatch } from '@/store/hooks';
import { changeAdminname,changeToken } from '@/store/modules/admin';
import { useNavigate } from 'react-router-dom';

// const onFinish = (values: any) => {
//   console.log('Success:', values);
// };

// const onFinishFailed = (errorInfo: any) => {
//   console.log('Failed:', errorInfo);
// };

const App: React.FC = () => {
  const [messageApi,contextHolder] = message.useMessage()
  const dispatch = useAppDispatch()
  const navigate = useNavigate()
  const onFinish = (values:{adminname:string,password:string})=>{
    loginAdmin(values).then(res=>{
      console.log('Success:', values);
      if(res.data.code === '10005'){
        console.log(res.data,values)
        messageApi.open({
          type:'error',
          content:'账号未注册'
        });
      } else if(res.data.code === '10003'){
        messageApi.open({
          type:'warning',
          content:'密码错误',
        });
      }else{
        messageApi.open({
          type:'success',
          content:'登陆成功'
        });
        dispatch(changeAdminname(res.data.data.adminname))
        dispatch(changeToken(res.data.data.token))
        navigate('/')
      }
    })
  };
  const onFinishFailed = (errorInfo:any)=>{
    console.log('Failed:',errorInfo)
  }
  return(
    <div className='login-form-box'>
      {contextHolder}
      <h1 className='login-form-title'>夜色后台管理系统</h1>
      <Form
      className='login-form'
    name="basic"
    wrapperCol={{ span: 24}}
    onFinish={onFinish}
    onFinishFailed={onFinishFailed}
    autoComplete="off"
  >
    <Form.Item
      name="adminname"
      rules={[{ required: true, message: '请输入管理员账户!' }]}
    >
      <Input placeholder='管理员账户'/>
    </Form.Item>

    <Form.Item
      name="password"
      rules={[{ required: true, message: '请输入管理员密码!' }]}
    >
      <Input.Password placeholder='密码'/>
    </Form.Item>

    

    <Form.Item>
      <Button type="primary" htmlType="submit" block style={{backgroundColor:'blue'}}>
        开始狂欢
      </Button>
    </Form.Item>
  </Form>
    </div>
    
  )
  
  };

export default App;